<template>
	<view class="home">
		<view class="header">
			<view class="location">
				<text class="iconfont icon-map" @click="getLocation">{{ list }}</text>
			</view>
			<view class="search">
				<text class="iconfont icon-search"></text>
				<input type="text" value="" placeholder="搜索关键字" />
			</view>
		</view>

		<ul class="nav">
			<li @click="feepay">
				<view class="fees"><image src="../../static/img/living.png" mode=""></image></view>
				<text>生活缴费</text>
			</li>
			<li @click="repairs">
				<view class="repairs"><image src="../../static/img/repairsLogo.png" mode=""></image></view>
				<text>物业报修</text>
			</li>
			<li @click="questions">
				<view class="question"><image src="../../static/img/questionsLogo.png" mode=""></image></view>
				<text>问题反馈</text>
			</li>
			<li @click="quesrCommunity">
				<view class="help"><image src="../../static/img/helpLogo.png" mode=""></image></view>
				<text>我要帮助</text>
			</li>
		</ul>
		<view class="con">
			<view class="headline">
				<view class="headlineheader">
					<image src="../../static/img/headline.png" mode=""></image>

					<view class="center">
						<swiper :indicator-dots="false" :vertical="true" :autoplay="true" :interval="2000">
							<swiper-item v-for="item in adlists">
								<view class="swiper-item">{{ item.title }}</view>
							</swiper-item>
						</swiper>
					</view>
					<view class="more" @click="news">
						<li></li>
						更多
						<text class="iconfont icon-fangxiang-you-copy"></text>
					</view>
				</view>
				<view class="headlinecon">
					<swiper :indicator-dots="false" :autoplay="true" :interval="2000" :duration="1000">
						<swiper-item v-for="item in adlists">
							<view class="swiper-item">
								<text class="pictext">{{ item.title }}</text>
								<image :src="URL + item.picture" mode=""></image>
							</view>
						</swiper-item>
					</swiper>
				</view>
			</view>
			<view class="stores">
				<view class="storesheader">生活门店</view>
				<view class="storecon">
					<view @click="stores" v-for="item in storeslist"><image :src="URL + item.picture" mode=""></image></view>
				</view>
			</view>
			<view class="news">
				<view class="newsheader">
					<text class="title">资讯</text>
					<text class="iconfont icon-fangxiang-you-copy" @click="news"></text>
				</view>
				<view class="newscon">
					<ul>
						<li v-for="(item, index) in newslist" :key="item.id" @click="godynamic(item.id)">
							<view class="titlebox">
								<view class="title">{{ item.title }}</view>
								<view class="time">{{ item.addtime | timeFormat }}</view>
							</view>
							<image :src="URL + item.picture" mode=""></image>
						</li>
					</ul>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import moment from 'moment'
import {IMGBASEURLS} from '../../utils/config.js';
import { newslist } from '../../api/news.js';
import {adlist} from '../../api/advertisement.js'
export default {
	data() {
		return {
			URL:IMGBASEURLS,
			page: 1,
			pagesize: 4,
			newslist: [],
			total: 0,
			indicatorDots: true,
			autoplay: true,
			interval: 2000,
			duration: 500,
			list:'',
			adfrom:{
				adtypeid:1
			},
			storesfrom:{
				storestypeid:2,
				page:1,
				psize:2
			},
			adlists:[],
			storeslist:[]

		};
	},
	onPullDownRefresh() {
		this.page = 1;
		this.newslist = [];
		this.getnewslist();
	},
	onReachBottom() {
		this.page++;
		this.getnewslist();
	},
	onLoad() {
		this.getadlist()
		this.getnewslist();
		this.getstoreslist()
	},
	filters: {
		timeFormat(val) {
			return moment(val).format("YYYY-MM-DD HH:mm")
		}
	},
	methods: {
		async getadlist(){
			let params={
				typeid:this.adfrom.adtypeid
			}
			let res = await adlist(params)
			console.log(res)
			this.adlists = res.data.list.filter(item=>item.enabled!==0)
		},
		async getstoreslist(){
			let params={
				typeid:this.storesfrom.storestypeid,
				page:this.storesfrom.page,
				psize:this.storesfrom.psize
			}
			let res = await adlist(params)
			console.log(res)
			this.storeslist = res.data.list.filter(item=>item.enabled!==0)
		},
		godynamic(id){
			console.log(id)
			uni.navigateTo({
				url:'/pages/dynamic/index?id='+id
			})
		},
		getLocation() {
			let self = this
			uni.chooseLocation({
				success: function (res) {
					console.log('位置名称：' + res.name);
					console.log('详细地址：' + res.address);
					console.log('纬度：' + res.latitude);
					console.log('经度：' + res.longitude);
					self.list = res.name
				}
			});
		},
		async getnewslist() {
			let res = await newslist({ page: this.page, psize: this.pagesize });
			// console.log(res.data.list);
			const list = this.newslist.concat(res.data.list);
			this.newslist = list;
			// console.log(this.newslist)
		},
		stores() {
			uni.switchTab({
				url: '/pages/stores/index'
			});

		},
			// 跳转
			quesrCommunity() {

				this.$navigateTo('/pages/questions/community');
			},
			feepay() {
				this.$navigateTo('/pages/feepay/index');
			},
			repairs() {
				this.$navigateTo('/pages/repairs/index');
			},
			questions() {
				this.$navigateTo('/pages/questions/index');
			},
			news() {
				this.$navigateTo('/pages/news/index');
			}
		}
	};
</script>
<style lang="less" scoped>
@import '@/static/style/index.less';
</style>
